/**
 * 由 WangYu 创建
 * 日期 2017/9/5
 */
import React, {Component} from 'react';
import {
    StyleSheet,
    Text,
    View,
    Image,
    ToastAndroid, TouchableOpacity,
} from 'react-native';
import {defaultStatusBarColor} from "../../config/Config";

const paddingDistance=30;
export default class TitleBar extends Component {
  static defaultProps={
        title:'默认标题'
    }
    constructor(props) {
        super(props);
    }

    render() {
      let rightIcon=this.props.rightIcon?
          <Image source={{uri:this.props.rightIcon}} style={styles.iconStyle}/>:null;
          let leftIcon=this.props.leftIcon?
              <Image source={{uri:this.props.leftIcon}} style={styles.iconStyle}/>:
              <Image source={{uri:'navigationbar_arrow_up'}} style={{width:15,height:15,}}/>;

        return (
            <View style={styles.container}>
                <View style={{width:paddingDistance}}>
                <TouchableOpacity onPress={this.props.onLeftIconPress}>
                        {leftIcon}
                </TouchableOpacity>
                </View>
                <Text style={styles.titleStyle}>{this.props.title}</Text>
               <View style={styles.rightViewStyle}>
                   <TouchableOpacity onPress={this.props.onRightIconPress}>
                       {rightIcon}
                   </TouchableOpacity>
               </View>
            </View>
        );
    }

}

const styles = StyleSheet.create({
    container: {
        flexDirection:'row',
        backgroundColor:defaultStatusBarColor,
        height:44,
        alignItems:'center',
        paddingLeft:10,
        paddingRight:10,
    },
    titleStyle:{
        fontSize:18,
        color:'white',
        textAlign:'center',
        textAlignVertical:'center',
        alignSelf:'center',
        flex:1,
    },
    iconStyle:{
        width:20,
        height:20,
    },
    rightViewStyle:{
        width:paddingDistance,
        height:15,
        justifyContent:'flex-end',
        flexDirection:'row',
        alignItems:'center',
    }
});
